<template>
  <div>
    <top-nav-bar :applyPageRoute="nowRouteTitle" @back="back"></top-nav-bar>
    <a-card :bordered="false" :bodyStyle="{ padding: '16px', height: '100%' }">
      <div>
        <h3 class="title">基本信息</h3>
        <div class="content_form">
          <a-form-model
            :model="formModel"
            :label-col="labelCol"
            :wrapper-col="wrapperCol"
            ref="formMMM"
            :rules="formRule"
          >
            <a-form-model-item label="课程名称" prop="name">
              <a-input v-model="formModel.name" style="width: 300px" />
            </a-form-model-item>
            <a-form-model-item label="课程类型">
              <span v-if="formModel.type == 2">一对多</span>
              <span v-if="formModel.type == 1">一对一</span>
            </a-form-model-item>
            <a-form-model-item label="课表颜色">
              <div class="likeRadio" v-for="(item, index) in color_arr" :key="index" @click="changeColor(index, item)">
                <span class="single_point_border" :style="{ 'border-color': color_index == index ? item.color : '' }">
                  <span class="single_point" :style="'background-color:' + item.color"></span>
                </span>
              </div>
            </a-form-model-item>
          </a-form-model>
        </div>
      </div>
      <div>
        <h3 class="title">收费方式</h3>
        <div class="content_form" style="border: 1px solid #d9d9d9; border-radius: 5px">
          <a-form-model :model="form" :label-col="labelCol" :wrapper-col="wrapperCol">
            <a-form-model-item label="适用校区">
              <a-radio-group v-model="formModel.choiceCampus" :disabled="true">
                <a-radio :value="0">全部校区</a-radio>
                <a-radio :value="1">指定校区</a-radio>
              </a-radio-group>
            </a-form-model-item>
            <div v-if="formModel.choiceCampus == 0">
              <a-form-model-item label="按课时收费">
                <a-switch v-model="all.by_class" />
              </a-form-model-item>
              <div v-if="all.by_class">
                <a-form-model-item label="定价标准">
                  <div class="table_part">
                    <div class="table_part_head">
                      <div class="title_content">校区名称</div>
                      <div class="title_content">名称</div>
                      <div class="title_content">数量(课时)</div>
                      <div class="title_content">总价</div>
                      <div class="title_content">
                        单价(元/课时)
                        <a-tooltip>
                          <template slot="title">计算结果为总价÷数量，保留两位小数</template>
                          <a-icon type="question-circle" />
                        </a-tooltip>
                      </div>

                      <div class="title_content">操作</div>
                    </div>
                    <div class="table_part_body" v-for="(item, index) in all.class_data" :key="index">
                      <div class="body_left">{{ item.campusName }}</div>
                      <div class="body_right">
                        <div class="displayFlex" v-for="(i, j) in item.arr" :key="j">
                          <div class="part_content">
                            <a-input placeholder="请输入名称" v-model="i.name"></a-input>
                            <p class="notice" v-if="i.ruleName">请输入名称</p>
                          </div>
                          <div class="part_content">
                            <a-input-number
                              placeholder="请输入数量"
                              v-model="i.number"
                              :min="0"
                              style="width: 80%"
                              :precision="2"
                              @change="computeUnitPrice(all.class_data, index, j)"
                            ></a-input-number>
                            <p class="notice" v-if="i.ruleNumber">请输入数量</p>
                          </div>
                          <div class="part_content">
                            <a-input-number
                              placeholder="请输入总价"
                              v-model="i.totalPrice"
                              :min="0"
                              style="width: 80%"
                              :precision="2"
                              @change="computeUnitPrice(all.class_data, index, j)"
                            ></a-input-number>
                            <p class="notice" v-if="i.rulePrice">请输入总价</p>
                          </div>
                          <div class="part_content">
                            {{ i.singlePrice || '自动计算' }}
                          </div>
                          <div class="part_content">
                            <a @click="del(all.class_data, index, j)">删除</a>
                          </div>
                        </div>
                        <div class="btm">
                          <div class="text">名称，数量，总价皆为必填数据，提交时会自动过滤无效数据</div>
                          <div class="button">
                            <a-button
                              type="primary"
                              size="small"
                              icon="plus"
                              :disabled="all.class_data[index].arr.length >= 10"
                              @click="add(all.class_data, index, 'danjia')"
                              >添加</a-button
                            >
                            <span class="statistical">（{{ all.class_data[index].arr.length }}/10）</span>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </a-form-model-item>
              </div>
              <a-form-model-item label="按天计费">
                <a-switch v-model="all.by_month" />
              </a-form-model-item>
              <div v-if="all.by_month">
                <a-form-model-item label="定价标准">
                  <div class="table_part">
                    <div class="table_part_head">
                      <div class="title_content">校区名称</div>
                      <div class="title_content">名称</div>
                      <div class="title_content">数量</div>
                      <div class="title_content">总价</div>
                      <div class="title_content">
                        单价(元/天)
                        <a-tooltip>
                          <template slot="title">计算结果为总价÷数量，保留两位小数</template>
                          <a-icon type="question-circle" />
                        </a-tooltip>
                      </div>
                      <div class="title_content">操作</div>
                    </div>
                    <div class="table_part_body" v-for="(item, index) in all.month_data" :key="index">
                      <div class="body_left">{{ item.campusName }}</div>
                      <div class="body_right">
                        <div class="displayFlex" v-for="(i, j) in item.arr" :key="j">
                          <div class="part_content">
                            <a-input placeholder="请输入名称" v-model="i.name"></a-input>
                            <p class="notice" v-if="i.ruleName">请输入名称</p>
                          </div>
                          <div class="part_content">
                            <a-input-number
                              placeholder="请输入数量"
                              v-model="i.number"
                              :min="0"
                              style="width: 80%"
                              :precision="0"
                              @change="computeUnitPrice(all.month_data, index, j)"
                            ></a-input-number>
                            <p class="notice" v-if="i.ruleNumber">请输入数量</p>
                          </div>
                          <div class="part_content">
                            <a-input-number
                              placeholder="请输入总价"
                              v-model="i.totalPrice"
                              :min="0"
                              style="width: 80%"
                              :precision="2"
                              @change="computeUnitPrice(all.month_data, index, j)"
                            ></a-input-number>
                            <p class="notice" v-if="i.rulePrice">请输入总价</p>
                          </div>
                          <div class="part_content">
                            {{ i.singlePrice || '自动计算' }}
                          </div>
                          <div class="part_content">
                            <a @click="del(all.month_data, index, j)">删除</a>
                          </div>
                        </div>
                        <div class="btm">
                          <div class="text">名称，数量，总价皆为必填数据，提交时会自动过滤无效数据</div>
                          <div class="button">
                            <a-button
                              type="primary"
                              size="small"
                              icon="plus"
                              :disabled="all.month_data[index].arr.length >= 10"
                              @click="add(all.month_data, index, 'month')"
                              >添加</a-button
                            >
                            <span class="statistical">（{{ all.month_data[index].arr.length }}/10）</span>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </a-form-model-item>
              </div>
            </div>
            <!-- 下面是部分校区 -->
            <div v-if="formModel.choiceCampus == 1">
              <a-form-model-item label="选择校区" v-if="formModel.choiceCampus == 1">
                <a-select
                  mode="multiple"
                  v-model="form.campusIds"
                  style="width: 200px"
                  placeholder="请选择校区"
                  @deselect="cancelSelect"
                  :disabled="true"
                >
                  <a-select-option v-for="(i, k) in campus_select" :key="k" :value="i.id">{{ i.name }}</a-select-option>
                </a-select>
                <span v-if="form.campusIds == ''" style="margin-left: 10px; font-size: 12px; color: #bbb"
                  >请先选择校区</span
                >
              </a-form-model-item>
              <a-form-model-item label="按课时收费" v-if="form.campusIds.length !== 0">
                <a-switch v-model="form.by_class" />
              </a-form-model-item>
              <div v-if="form.by_class && form.campusIds.length !== 0">
                <a-form-model-item label="定价标准">
                  <div class="table_part">
                    <div class="table_part_head">
                      <div class="title_content">校区名称</div>
                      <div class="title_content">名称</div>
                      <div class="title_content">数量(课时)</div>
                      <div class="title_content">总价</div>
                      <div class="title_content">
                        单价(元/课时)
                        <a-tooltip>
                          <template slot="title">计算结果为总价÷数量，保留两位小数</template>
                          <a-icon type="question-circle" />
                        </a-tooltip>
                      </div>

                      <div class="title_content">操作</div>
                    </div>
                    <div class="table_part_body" v-for="(item, index) in form.class_data" :key="index">
                      <div class="body_left">{{ item.campusName }}</div>
                      <div class="body_right">
                        <div class="displayFlex" v-for="(i, j) in item.arr" :key="j">
                          <div class="part_content">
                            <a-input placeholder="请输入名称" v-model="i.name"></a-input>
                            <p class="notice" v-if="i.ruleName">请输入名称</p>
                          </div>
                          <div class="part_content">
                            <a-input-number
                              placeholder="请输入数量"
                              v-model="i.number"
                              :min="0"
                              style="width: 80%"
                              :precision="2"
                              @change="computeUnitPrice(form.class_data, index, j)"
                            ></a-input-number>
                            <p class="notice" v-if="i.ruleNumber">请输入数量</p>
                          </div>
                          <div class="part_content">
                            <a-input-number
                              placeholder="请输入总价"
                              v-model="i.totalPrice"
                              :min="0"
                              style="width: 80%"
                              :precision="2"
                              @change="computeUnitPrice(form.class_data, index, j)"
                            ></a-input-number>
                            <p class="notice" v-if="i.rulePrice">请输入总价</p>
                          </div>
                          <div class="part_content">
                            {{ i.singlePrice || '自动计算' }}
                          </div>
                          <div class="part_content">
                            <a @click="del(form.class_data, index, j)">删除</a>
                          </div>
                        </div>
                        <div class="btm">
                          <div class="text">名称，数量，总价皆为必填数据，提交时会自动过滤无效数据</div>
                          <div class="button">
                            <a-button
                              type="primary"
                              size="small"
                              icon="plus"
                              :disabled="form.class_data[index].arr.length >= 10"
                              @click="add(form.class_data, index, 'danjia')"
                              >添加</a-button
                            >
                            <span class="statistical">（{{ form.class_data[index].arr.length }}/10）</span>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </a-form-model-item>
              </div>
              <a-form-model-item label="按天收费" v-if="form.campusIds.length !== 0">
                <a-switch v-model="form.by_month" />
              </a-form-model-item>
              <div v-if="form.by_month && form.campusIds.length !== 0">
                <a-form-model-item label="定价标准">
                  <div class="table_part">
                    <div class="table_part_head">
                      <div class="title_content">校区名称</div>
                      <div class="title_content">名称</div>
                      <div class="title_content">数量(天)</div>
                      <div class="title_content">总价</div>
                      <div class="title_content">
                        单价(元/天)
                        <a-tooltip>
                          <template slot="title">计算结果为总价÷数量，保留两位小数</template>
                          <a-icon type="question-circle" />
                        </a-tooltip>
                      </div>
                      <div class="title_content">操作</div>
                    </div>
                    <div class="table_part_body" v-for="(item, index) in form.month_data" :key="index">
                      <div class="body_left">{{ item.campusName }}</div>
                      <div class="body_right">
                        <div class="displayFlex" v-for="(i, j) in item.arr" :key="j">
                          <div class="part_content">
                            <a-input placeholder="请输入名称" v-model="i.name"></a-input>
                            <p class="notice" v-if="i.ruleName">请输入名称</p>
                          </div>
                          <div class="part_content">
                            <a-input-number
                              placeholder="请输入数量"
                              v-model="i.number"
                              :min="0"
                              style="width: 80%"
                              :precision="0"
                              @change="computeUnitPrice(form.month_data, index, j)"
                            ></a-input-number>
                            <p class="notice" v-if="i.ruleNumber">请输入数量</p>
                          </div>
                          <div class="part_content">
                            <a-input-number
                              placeholder="请输入总价"
                              v-model="i.totalPrice"
                              :min="0"
                              style="width: 80%"
                              :precision="2"
                              @change="computeUnitPrice(form.month_data, index, j)"
                            ></a-input-number>
                            <p class="notice" v-if="i.rulePrice">请输入总价</p>
                          </div>
                          <div class="part_content">
                            {{ i.singlePrice || '自动计算' }}
                          </div>
                          <div class="part_content">
                            <a @click="del(form.month_data, index, j)">删除</a>
                          </div>
                        </div>
                        <div class="btm">
                          <div class="text">名称，数量，总价皆为必填数据，提交时会自动过滤无效数据</div>
                          <div class="button">
                            <a-button
                              type="primary"
                              size="small"
                              icon="plus"
                              :disabled="form.month_data[index].arr.length >= 10"
                              @click="add(form.month_data, index, 'month')"
                              >添加</a-button
                            >
                            <span class="statistical">（{{ form.month_data[index].arr.length }}/10）</span>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </a-form-model-item>
              </div>
            </div>
          </a-form-model>
        </div>
      </div>
      <div>
        <h3 class="title">其他信息</h3>
        <div class="content_form">
          <a-form-model :model="formModel" :label-col="labelCol" :wrapper-col="wrapperCol">
            <a-form-model-item label="请假是否扣课时" v-if="formModel.type == 2">
              <a-radio-group v-model="formModel.leave_cut_hour">
                <a-radio :value="1" name="type">扣</a-radio>
                <a-radio :value="2" name="type">不扣</a-radio>
              </a-radio-group>
            </a-form-model-item>
            <a-form-model-item label="未到是否扣课时" v-if="formModel.type == 2">
              <a-radio-group v-model="formModel.no_come_cut_hour">
                <a-radio :value="1" name="type">扣</a-radio>
                <a-radio :value="2" name="type">不扣</a-radio>
              </a-radio-group>
            </a-form-model-item>
            <!-- <a-form-model-item label="上课安排">
              <a @click="visible=true">添加</a>
              <div class="showClassPlans">
                <a-row class="classPlanLine" v-for="(i,j) in formModel.classPlan" :key="j">
                  <a-col :span="18" class="leftAction">
                    <span class="title">{{i.name}}</span>
                    <span class="nowLineCount" style="color: #999;">({{i.planList.length}}次课)</span>
                  </a-col>
                  <a-col :span="6" style="text-align:right" class="rightAction">
                    <a-icon type="edit" class="icons_" theme="filled" @click="editPlanLists(i,j)" />
                    <a-icon type="delete" class="icons_" theme="filled" @click="delPlanList(j)" />
                  </a-col>
                </a-row>
              </div>
            </a-form-model-item>-->
            <a-form-model-item label="备注">
              <a-input
                v-model="formModel.remarks"
                placeholder="请输入(选填,最多输入100个字符)"
                :max-length="100"
                type="textarea"
                style="width: 500px"
              />
            </a-form-model-item>
            <a-form-model-item :wrapper-col="{ span: 14, offset: 4 }">
              <a-button type="primary" @click="onSubmit('formMMM')">保存</a-button>
              <a-button style="margin-left: 10px" @click="back()">返回</a-button>
            </a-form-model-item>
          </a-form-model>
          <a-modal title="新增上课安排" :visible="visible" @ok="addClassPlan" @cancel="cancelAddClassPlan">
            <a-form-model :model="classPlanForm" :label-col="{ span: 6 }" :wrapper-col="{ span: 16 }">
              <!-- :rules -->
              <a-form-model-item
                label="名称"
                style="margin-bottom: 10px"
                :rules="{
                  required: true,
                  message: '请输入课程名称',
                  trigger: 'blur',
                }"
              >
                <a-input v-model="classPlanForm.name" placeholder="10字以内" :maxLength="10" style="width: 236px" />
              </a-form-model-item>
              <a-form-model-item label="安排列表" :colon="false" style="margin-bottom: 5px"></a-form-model-item>
              <div style="max-height: 400px; overflow-y: auto">
                <div v-for="(item, index) in classPlanForm.planList" :key="index">
                  <!-- 这里写v-for -->
                  <a-form-model-item :label="'第' + `${index + 1}` + '次课'" style="margin-bottom: 5px">
                    <a-input
                      v-model="item.value"
                      placeholder="本次排课上课内容，20字以内"
                      :maxLength="20"
                      style="width: 236px"
                    />
                    <a-button
                      shape="circle"
                      icon="line"
                      size="small"
                      style="margin-left: 10px"
                      @click="delPlan(index)"
                    />
                  </a-form-model-item>
                </div>
              </div>
              <a-form-model-item label=" " :colon="false">
                <a-button style="width: 236px" icon="plus" type="dashed" @click="pushContent('addClassPlanModel')"
                  >添加</a-button
                >
              </a-form-model-item>
            </a-form-model>
          </a-modal>
          <a-modal title="编辑上课安排" :visible="editVisible" @ok="editClassPlan" @cancel="cancelAddClassPlan">
            <a-form-model :model="classPlanForm" :label-col="{ span: 6 }" :wrapper-col="{ span: 16 }">
              <!-- :rules -->
              <a-form-model-item label="名称" style="margin-bottom: 10px">
                <a-input v-model="classPlanForm.name" placeholder="10字以内" :maxLength="10" style="width: 236px" />
              </a-form-model-item>
              <a-form-model-item label="安排列表" :colon="false" style="margin-bottom: 5px"></a-form-model-item>
              <div style="max-height: 400px; overflow-y: auto">
                <div v-for="(item, index) in classPlanForm.planList" :key="index">
                  <!-- 这里写v-for -->
                  <a-form-model-item :label="'第' + `${index + 1}` + '次课'" style="margin-bottom: 5px">
                    <a-input
                      v-model="item.value"
                      placeholder="本次排课上课内容，20字以内"
                      :maxLength="20"
                      style="width: 236px"
                    />
                    <a-button
                      shape="circle"
                      icon="line"
                      size="small"
                      style="margin-left: 10px"
                      @click="delPlan(index)"
                    />
                  </a-form-model-item>
                </div>
              </div>
              <a-form-model-item label=" " :colon="false">
                <a-button style="width: 236px" icon="plus" type="dashed" @click="pushContent()">添加</a-button>
              </a-form-model-item>
            </a-form-model>
          </a-modal>
        </div>
      </div>
    </a-card>
  </div>
</template>

<script>
import colorsArr from '@/utils/schedule_colors'
import topNavBar from '@/components/topNavBar/topNavBar'
import { campusList } from '@/api/structure'
import { courseCreate, courseInfo, courseEdit } from '@/api/courseCharge'

export default {
  name: 'BaseForm',
  components: {
    topNavBar,
  },

  data() {
    return {
      nowRouteTitle: '',
      labelCol: { span: 4 },
      wrapperCol: { span: 14 },
      schoolID: null,
      borderLonger: '0',
      campus_select: [], //校区下拉
      visible: false, //新增上课安排
      editVisible: false, //编辑上课安排
      storeLocation: null, // 存放数组index
      courseId: null, //存放获取的课表的ID
      formModel: {
        choiceCampus: 0, //应用校区  默认为 全部校区==0
        name: '',
        type: 1,
        color: 1,
        leave_cut_hour: 2,
        no_come_cut_hour: 1,
        remarks: '',
        classPlan: [],
      },
      formRule: {
        name: [{ required: true, message: '请输入课程名称', trigger: 'blur' }],
      },
      classPlanForm: {
        name: '',
        planList: [],
      },
      form: {
        //部分校区
        by_class: true,
        by_month: false,
        campusIds: [], //默认为[]--->全部校区
        class_data: [],
        month_data: [],
      },
      all: {
        //全部校区
        by_class: true,
        by_month: false,
        campusIds: [], //默认为[]--->全部校区
        class_data: [
          {
            campusID: 0,
            campusName: '全部校区',
            arr: [
              {
                name: '单价',
                number: 1,
                totalPrice: null,
                singlePrice: null,
              },
            ],
          },
        ],
        month_data: [
          {
            campusID: 0,
            campusName: '全部校区',
            arr: [
              {
                name: '每天',
                number: 1,
                totalPrice: null,
                singlePrice: null,
              },
            ],
          },
        ],
      },
      color_index: 0, //课表颜色
      color_arr: colorsArr, //课表颜色
    }
  },
  created() {
    this.nowRouteTitle = this.$route.meta.title
    this.schoolID = this.$store.state.user.school
    campusList({ pageSize: 999999, school_id: this.schoolID }).then((res) => {
      this.campus_select = res
    })
    courseInfo(this.$route.query.id).then((res) => {
      this.courseId = res.id
      this.formModel.name = res.name
      this.formModel.type = res.type
      this.formModel.leave_cut_hour = res.leave_cut_hour
      this.formModel.no_come_cut_hour = res.no_come_cut_hour
      this.formModel.remarks = res.remarks
      this.color_index = res.color
      // 判断全部课程或部分课程
      if (res.price_arr.campusIds[0] == 0) {
        if (res.price_arr.class_data.length > 0) {
          res.price_arr.class_data.forEach((val) => {
            val.campusName = '全部校区'
            val.ruleName = false
            val.ruleNumber = false
            val.rulePrice = false
          })
        } else {
          res.price_arr.class_data.push({
            campusID: 0,
            campusName: '全部校区',
            arr: [
              {
                name: '单价',
                number: 1,
                totalPrice: null,
                singlePrice: null,
                ruleName: false,
                ruleNumber: false,
                rulePrice: true,
              },
            ],
          })
        }
        if (res.price_arr.month_data.length > 0) {
          res.price_arr.month_data.forEach((val) => {
            val.campusName = '全部校区'
            val.ruleName = false
            val.ruleNumber = false
            val.rulePrice = false
          })
        } else {
          res.price_arr.month_data.push({
            campusID: 0,
            campusName: '全部校区',
            arr: [
              {
                name: '每天',
                number: 1,
                totalPrice: null,
                singlePrice: null,
                ruleName: false,
                ruleNumber: false,
                rulePrice: true,
              },
            ],
          })
        }
        res.price_arr.campusIds = []
        this.formModel.choiceCampus = 0
        this.all = res.price_arr
      } else if (res.price_arr.campusIds.length > 0 && res.price_arr.campusIds[0] !== 0) {
        this.formModel.choiceCampus = 1
        this.form = res.price_arr
      }
    })
  },
  watch: {
    visible(val) {
      if (val == false) {
        this.storeLocation = null
      }
    },
    editVisible(val) {
      if (val == false) {
        this.storeLocation = null
      }
    },
    'all.by_month'(val) {},
    'form.campusIds': {
      handler(newval, oldVal) {
        if (!oldVal) {
          //首次执行时没有oldval，界面会报错，给oldval赋值
          oldVal = []
        }
        if (newval.length == 0) {
          this.form.by_class = false
          this.form.by_month = false
        }
        if (newval.length > oldVal.length) {
          newval.forEach((i) => {
            if (oldVal.indexOf(i) == -1) {
              this.campus_select.forEach((value) => {
                //部分校区没有初始数据时执行
                if (this.form.class_data.length == 0) {
                  if (i == value.id) {
                    this.form.class_data.push({
                      campusID: value.id,
                      campusName: value.name,
                      arr: [
                        {
                          name: '单价',
                          number: 1,
                          totalPrice: null,
                          singlePrice: null,
                          rulePrice: true,
                          ruleNumber: false,
                          ruleName: false,
                        },
                      ],
                    })
                  }
                } else {
                  if (i == value.id) {
                    let num = 0
                    this.form.class_data.forEach((item) => {
                      if (item.campusID == value.id) {
                        if (item.arr.length == 0) {
                          item.arr.push({
                            name: '单价',
                            number: 1,
                            totalPrice: null,
                            singlePrice: null,
                            rulePrice: true,
                            ruleNumber: false,
                            ruleName: false,
                          })
                        }
                        num++
                      }
                    })
                    if (num == 0) {
                      this.form.class_data.push({
                        campusID: value.id,
                        campusName: value.name,
                        arr: [
                          {
                            name: '单价',
                            number: 1,
                            totalPrice: null,
                            singlePrice: null,
                            rulePrice: true,
                            ruleNumber: false,
                            ruleName: false,
                          },
                        ],
                      })
                    }
                  }
                }
                if (this.form.month_data.length == 0) {
                  if (i == value.id) {
                    this.form.month_data.push({
                      campusID: value.id,
                      campusName: value.name,
                      arr: [
                        {
                          name: '每天',
                          number: 1,
                          totalPrice: null,
                          singlePrice: null,
                          rulePrice: true,
                          ruleNumber: false,
                          ruleName: false,
                        },
                      ],
                    })
                  }
                } else {
                  if (i == value.id) {
                    let num = 0
                    this.form.month_data.forEach((item) => {
                      if (item.campusID == value.id) {
                        if (item.arr.length == 0) {
                          item.arr.push({
                            name: '每天',
                            number: 1,
                            totalPrice: null,
                            singlePrice: null,
                            rulePrice: true,
                            ruleNumber: false,
                            ruleName: false,
                          })
                        }
                        num++
                      }
                    })
                    if (num == 0) {
                      this.form.month_data.push({
                        campusID: value.id,
                        campusName: value.name,
                        arr: [
                          {
                            name: '每天',
                            number: 1,
                            totalPrice: null,
                            singlePrice: null,
                            rulePrice: true,
                            ruleNumber: false,
                            ruleName: false,
                          },
                        ],
                      })
                    }
                  }
                }
              })
            }
          })
        }
      },
      immediate: true,
    },
  },
  methods: {
    onSubmit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          let params = JSON.parse(JSON.stringify(this.formModel))
          if (params.choiceCampus == 0) {
            let data = JSON.parse(JSON.stringify(this.all))
            if (data.by_month) {
              for (let i = data.month_data[0].arr.length - 1; i >= 0; i--) {
                if (data.month_data[0].arr[i].ruleName) {
                  this.$message.error('请输入名称')
                  return
                } else if (data.month_data[0].arr[i].ruleNumber) {
                  this.$message.error('请输入数量')
                  return
                } else if (data.month_data[0].arr[i].rulePrice) {
                  this.$message.error('请输入总价')
                  return
                } else {
                  delete data.month_data[0].arr[i].ruleName
                  delete data.month_data[0].arr[i].ruleNumber
                  delete data.month_data[0].arr[i].rulePrice
                }
              }
            } else {
              data.month_data.length = 0
            }
            if (data.by_class) {
              for (let j = data.class_data[0].arr.length - 1; j >= 0; j--) {
                if (data.class_data[0].arr[j].ruleName) {
                  this.$message.error('请输入名称')
                  return
                } else if (data.class_data[0].arr[j].ruleNumber) {
                  this.$message.error('请输入数量')
                  return
                } else if (data.class_data[0].arr[j].rulePrice) {
                  this.$message.error('请输入总价')
                  return
                } else {
                  delete data.class_data[0].arr[j].ruleName
                  delete data.class_data[0].arr[j].ruleNumber
                  delete data.class_data[0].arr[j].rulePrice
                }
              }
            } else {
              data.class_data.length = 0
            }
            params.price_arr = data
          } else {
            let data = JSON.parse(JSON.stringify(this.form))
            if (data.campusIds.length == 0) {
              this.$message.warning('请选择校区')
              return
            }
            let countNUM_month = 0
            let countNUM_class = 0
            if (data.by_month) {
              let firstLoop = false
              for (let num = data.month_data.length; num--; ) {
                let val = data.month_data[num]
                let flag = false
                for (let i = val.arr.length - 1; i >= 0; i--) {
                  if (val.arr[i].ruleName) {
                    this.$message.error('请输入名称')
                    return
                  } else if (val.arr[i].ruleNumber) {
                    this.$message.error('请输入数量')
                    return
                  } else if (val.arr[i].rulePrice) {
                    this.$message.error('请输入总价')
                    return
                  } else {
                    delete val.arr[i].ruleName
                    delete val.arr[i].ruleNumber
                    delete val.arr[i].rulePrice
                  }
                }
                if (flag) {
                  firstLoop = true
                  break
                }
                if (val.arr.length > 0) {
                  countNUM_month++
                }
                if (firstLoop) {
                  return
                }
              }
            } else {
              data.month_data.length = 0
            }
            if (data.by_class) {
              let firstLoop = false
              for (let num1 = data.class_data.length; num1--; ) {
                let val1 = data.class_data[num1]
                let flag = false
                for (let i = val1.arr.length - 1; i >= 0; i--) {
                  if (val1.arr[i].ruleName) {
                    flag = true
                    this.$message.error('请输入名称')
                    break
                  } else if (val1.arr[i].ruleNumber) {
                    flag = true
                    this.$message.error('请输入数量')
                    break
                  } else if (val1.arr[i].rulePrice) {
                    flag = true
                    this.$message.error('请输入总价')
                    break
                  } else {
                    delete val1.arr[i].ruleName
                    delete val1.arr[i].ruleNumber
                    delete val1.arr[i].rulePrice
                  }
                }
                if (flag) {
                  firstLoop = true
                  break
                }
                if (val1.arr.length > 0) {
                  countNUM_class++
                }
              }
              if (firstLoop) {
                return
              }
            } else {
              data.class_data.length = 0
            }

            params.price_arr = data
          }
          params.color = this.color_index
          params.school_id = this.$store.state.user.school
          if (params.type == 1) {
            params.no_come_cut_hour = 2
            params.leave_cut_hour = 2
          }

          courseEdit(params, this.courseId)
            .then((res) => {
              this.$message.success('修改成功')
              this.back()
            })
            .catch((err) => {
              this.$message.error(err.data.message || '修改失败')
            })
        } else {
          this.$message.warning('请输入课程名称')
          return false
        }
      })
    },
    changeColor(e, data) {
      this.color_index = e
    },
    addAllCampusTableLine(e, data) {
      if (e.length >= 10) {
        return
      } else {
        e.push({
          name: '',
          number: null,
          totalPrice: null,
          singlePrice: null,
        })
      }
    },
    delAllCampusTableLine(e, data) {
      e.splice(data, 1)
    },
    back() {
      this.$router.go(-1)
    },
    cancelSelect(e) {
      this.form.class_data.forEach((val, index) => {
        if (e == val.campusID) {
          this.form.class_data.splice(index, 1)
        }
      })
      this.form.month_data.forEach((val, index) => {
        if (e == val.campusID) {
          this.form.month_data.splice(index, 1)
        }
      })
    },
    computeUnitPrice(a, b, c) {
      if (a[b].arr[c].name) {
        a[b].arr[c].ruleName = false
      } else {
        a[b].arr[c].ruleName = true
      }
      if (a[b].arr[c].number) {
        a[b].arr[c].ruleNumber = false
      } else {
        a[b].arr[c].ruleNumber = true
      }
      if (a[b].arr[c].totalPrice) {
        a[b].arr[c].rulePrice = false
      } else {
        a[b].arr[c].rulePrice = true
      }
      //计算单价
      if (a[b].arr[c].number && a[b].arr[c].totalPrice) {
        let average = a[b].arr[c].totalPrice / a[b].arr[c].number //平均值
        a[b].arr[c].singlePrice = average.toFixed(2) //保留两位小数
      }
    },
    add(a, b, c) {
      a[b].arr.push({
        name: c == 'danjia' ? '单价' : c == 'month' ? '每天' : '',
        number: 1,
        totalPrice: null,
        singlePrice: null,
        rulePrice: true,
        ruleNumber: false,
        ruleName: false,
      })
    },
    del(a, b, c) {
      a[b].arr.splice(c, 1)
    },
    //上课安排列表
    delPlanList(e) {
      this.formModel.classPlan.splice(e, 1)
    },
    editPlanLists(e, j) {
      this.classPlanForm = e
      this.storeLocation = j
      this.editVisible = true
    },
    //新增上课安排/编辑上课安排  ---弹框
    addClassPlan() {
      let data = JSON.parse(JSON.stringify(this.classPlanForm))
      if (data.name == '') {
        this.$message.error('请输入名称')
        return
      } else {
        for (let i = data.planList.length - 1; i >= 0; i--) {
          if (data.planList[i].value == '') {
            data.planList.splice(i, 1)
          }
        }
        if (data.planList.length == 0) {
          this.$message.error('请至少添加一次上课安排')
          return
        } else {
          this.formModel.classPlan.push(data)
          this.classPlanForm = {
            name: '',
            planList: [],
          }
          this.visible = false
        }
      }
    },
    cancelAddClassPlan() {
      this.visible = false
      this.editVisible = false
      this.classPlanForm = {
        name: '',
        planList: [],
      }
    },
    delPlan(e) {
      this.classPlanForm.planList.splice(e, 1)
    },
    pushContent() {
      // 上课安排弹窗 安排列表内容添加
      this.classPlanForm.planList.push({ value: '' })
    },
    editClassPlan() {
      //编辑上课安排
      let data = JSON.parse(JSON.stringify(this.classPlanForm))
      if (data.name == '') {
        this.$message.error('请输入名称')
        return
      } else {
        for (let i = data.planList.length - 1; i >= 0; i--) {
          if (data.planList[i].value == '') {
            data.planList.splice(i, 1)
          }
        }
        if (data.planList.length == 0) {
          this.$message.error('请至少添加一次上课安排')
          return
        } else {
          this.formModel.classPlan.splice(this.storeLocation, 1, data)
          this.classPlanForm = {
            name: '',
            planList: [],
          }
          this.editVisible = false
        }
      }
    },
  },
}
</script>
<style lang="less">
</style>
<style lang="less" scoped>
.notice {
  color: red;
  margin-bottom: 0;
  text-align: center;
  line-height: 20px;
}
.showClassPlans {
  width: 510px;
  .classPlanLine {
    .rightAction {
      .icons_ {
        margin: 0 16px;
        cursor: pointer;
      }
    }
  }
}
.table_part {
  width: 1052px;
  border: 1px solid #e8e8e8;
  .table_part_head {
    background: #f7f8f9;
    display: flex;
    .title_content {
      justify-content: space-between;
      width: 170px;
      text-align: center;
    }
    .title_content:first-child {
      width: 200px;
    }
  }
  .table_part_body {
    border-top: 1px solid #e8e8e8;
    .body_left {
      width: 200px;
      display: table-cell;
      vertical-align: middle;
      text-align: center;
    }
    .body_right {
      border-left: 1px solid #e8e8e8;
      display: table-cell;
      text-align: center;
      .displayFlex {
        display: flex;
        padding: 8px 0;
        .part_content {
          padding: 0 8px;
          justify-content: space-between;
          width: 170px;
          text-align: center;
        }
      }
      .btm {
        width: 850px;
        border-top: 1px solid #e8e8e8;
        .text {
          text-align: left;
          width: 600px;
          padding: 0 10px;
          display: inline-block;
          font-size: 12px;
        }
        .button {
          width: 250px;
          display: inline-block;
          text-align: right;
          .statistical {
            display: inline-block;
            margin-right: 10px;
            color: #999;
          }
        }
      }
    }
  }
  .table_part_body:first-child {
    border: none;
  }
}
.cycle_table_outside_div {
  border-top: 1px solid rgb(217, 217, 217);
}

.likeRadio {
  display: inline-block;
  margin-right: 20px;
  .single_point_border {
    display: inline-block;
    border: 2px solid white;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    justify-content: space-around;
    align-items: center;
    cursor: pointer;
    .single_point {
      display: inline-block;
      width: 10px;
      height: 10px;
      border-radius: 50%;
    }
  }
}
.content_form {
  padding: 20px 0;
  margin-bottom: 20px;
  margin-top: 20px;
}
.account-settings-info-left {
  display: none !important;
}
.studentInfoAction {
  display: inline-block;
  float: right;
  button {
    margin-left: 8px;
  }
}
.studentBasicInfo {
  display: inline-block;
  padding: 0 30px;
  vertical-align: middle;
  .studentName {
    color: #373737;
    font-size: 16px;
  }
  .studentSex {
    padding: 0 10px;
  }
  .studentAge {
    color: #999;
  }
  .beReading {
    display: inline-block;
    border: 1px solid rgb(59, 189, 170);
    color: rgb(59, 189, 170);
    font-size: 12px;
    padding: 0 5px;
    margin-top: 5px;
  }
}
</style>